<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="keywords" content="jquery,ui,easy,easyui,web">
    <meta name="description" content="easyui help you build your web page easily!">
    <title>Filter ComboGrid - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="../../lib/jquery-easyui-1.4.2/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../lib/jquery-easyui-1.4.2/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../../lib/jquery-easyui-1.4.2/demo/demo.css">
    <script type="text/javascript" src="../../lib/jquery-easyui-1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="../../lib/jquery-easyui-1.4.2/jquery.easyui.min.js"></script>
</head>
<body>
<h2>Filter ComboGrid Demo</h2>
<div class="demo-info" style="margin-bottom:10px">
    <div class="demo-tip icon-tip">&nbsp;</div>
    <div>Type in the input box to filter ComboGrid data.</div>
</div>

<input id="cg" style="width:150px"/>
<script type="text/javascript">
    $(function(){
        $('#cg').combogrid({
            panelWidth:500,
            url: './data/json.data',
            idField:'itemid',
            textField:'productid',
            mode:'local',
            fitColumns:true,
            columns:[[
                {field:'itemid',title:'Item ID',width:60},
                {field:'productid',title:'Product ID',width:80},
                {field:'listprice',title:'List Price',align:'right',width:60,hidden:true},
                {field:'unitcost',title:'Unit Cost',align:'right',width:60},
                {field:'attr1',title:'Attribute',width:150},
                {field:'status',title:'Stauts',align:'center',width:60,hidden:true}
            ]]
        });
    });
</script>
</body>
</html>